* {
  padding: 0;
  margin: 0;
}

:root {
  $bgColor: #000;
  body {
    width: 100vw;
    height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: $bgColor;
    main {
      font-family: Arial, Helvetica, sans-serif;
      font-weight: bold;
      font-size: 50px;
      text-transform: uppercase;
      box-sizing: border-box;
      color: transparent;
      background-clip: text;
      background-image: url('hd2.jpeg');
      background-size: 200% 150%;
      background-repeat: no-repeat;
      animation: identifier 10s infinite both
        cubic-bezier(0.17, 0.67, 0.83, 0.67);
    }
  }
}

@keyframes identifier {
  from {
    background-position: -50% 0%;
  }

  50% {
    background-position: 100% 0%;
  }

  to {
    background-position: -50% 0%;
  }
}
